<!DOCTYPE html>
<html lang="zh">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>伪元素选择器</title>
    <style>
        /* 
            伪元素用来表示网页中特殊的位置
                - 伪元素使用::开头
                例子：
                    ::first-letter 第一个字符
                    ::first-line 第一行
                    ::selection 选中的内容
                    ::before 标签的开始位置
                    ::after 标签的结束位置
        */
        /* span{
            font-size: 40px;
            color: red;
        } */
        /* p::first-letter{
            font-size: 40px;
            color: yellowgreen;
        } */

        /* p::first-line{
            background-color: orange;
        } */

        /* p::selection{
            background-color: yellowgreen;
        } */

        div::before{
            /* content可以用来向before或after中添加内容 */
            content: '“';
        }

        div::after{
            content: '”';
        }
    </style>
</head>
<body>

    <div>我是一个div</div>

    <!-- <p>
        Lorem ipsum dolor sit amet consectetur adipisicing elit. Culpa facilis maiores aliquam, cumque necessitatibus ad eos alias. Doloribus ex asperiores repellendus labore a nulla possimus ut exercitationem, esse laborum. Nesciunt.
    </p> -->
    
</body>
</html>